<template>
    <div ref="wrapper">
      <slot></slot>
    </div>
</template>

<script>
  import BScroll from 'better-scroll'
  export default {
    name: 'Scroll',
    props:{
      probeType:{
        type:Number,
        default:1,
      },
      click:{
        type:Boolean,
        default: true,
      },
      data:{
        type:Array,
        default:null,
      },
      listenScroll:{
        type:Boolean,
        default:false,
      },
      //是否下拉刷新
      pullFreshen:{
        type:Boolean,
        default:false,
      },
      beforeScroll:{
        type:Boolean,
        default:false,
      },
      refreshDelay:{
        type:Number,
        default:20,
      }
    },
    mounted () {
      setTimeout(()=>{
        this.initScroll();
      },20)
    },
    methods:{
      initScroll(){
        if(!this.$refs.wrapper){
          return;
        }
        this.scroll = new BScroll(this.$refs.wrapper,{
          probeType: this.probeType,
          click: this.click,
        })

        if(this.listenScroll){
          var me = this;
          this.scroll.on('scroll',(pos)=>{
            me.$emit('scroll',pos)
          })
        }

        //是否下拉刷新
        if(this.pullFreshen){
          this.scroll.on('scrollEnd',()=>{
            if(this.scroll.y <=(this.scroll.maxScrollY + 50)){
              this.$emit('scrollToEnd')
            }
          })
        }

        if(this.beforeScroll){
          this.scroll.on('beforeScrollStart',()=>{
            this.$emit('beforeScroll')
          })
        }

      },
      enable(){
        this.scroll && this.scroll.enable();
      },
      disable(){
        this.scroll && this.scroll.disable();
      },
      refresh(){
        this.scroll && this.scroll.refresh();
      },
      scrollTo(){
        this.scroll && this.scroll.scrollTo.apply(this.scroll,arguments);
      },
      scrollToElement(){
        this.scroll && this.scroll.scrollToElement.apply(this.scroll,arguments)
      }
    },
    watch:{
      data(){
        setTimeout(()=>{
          this.refresh();
        },this.refreshDelay)
      }
    }
  }
</script>

<style scoped>

</style>
